<template>
  <d2-container class="taskmonitor">
    <template slot="header">刷手操作日志</template>
    <el-row :gutter="20">
      <el-col :span="3">
        <el-select size="small" clearable v-model="activval" placeholder="任务状态">
          <el-option
            v-for="item in activlist"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-col>
      <el-col :span="3">
        <el-select size="small" clearable  v-model="auditval" placeholder="请选择">
          <el-option
            v-for="item in auditlist"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-col>
      <el-col :span="4">
        <el-input size="small" v-model="iptval" placeholder="请输入内容"></el-input>
      </el-col>
      <el-col :span="9">
        <el-date-picker
          style="width:100%;"
          size="small"
          v-model="timeval"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          format="yyyy 年 MM 月 dd 日"
          value-format="yyyy-MM-dd HH:mm:ss">
        </el-date-picker>
      </el-col>
      <el-col :span="2">
        <el-button size="mini" type="primary" @click="onSearch">查询</el-button>
      </el-col>
    </el-row>
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        label="序号"
        width='100'
        type="index">
      </el-table-column>
      <el-table-column
        prop="operation_name"
        label="操作员">
      </el-table-column>
      <el-table-column
        prop="operation_ip"
        label="操作员IP地址">
      </el-table-column>
      <el-table-column
        prop="operation_time"
        label="创建时间">
      </el-table-column>
      <el-table-column
        prop="operation_value"
        label="操作内容">
      </el-table-column>
    </el-table>
    <el-pagination
      @current-change="handleCurrentChange"
      :current-page.sync="page"
      :page-size="20"
      layout="total, prev, pager, next"
      :total="total"
      style="text-align:right;margin:10px 0;">
    </el-pagination>
  </d2-container>
</template>

<script>
  import {SelectLog} from '@api/sys.login'

  export default {
    data() {
      return {
        tableData: [],
        page: 1,
        total: 0,
        activval: '',
        activlist: [
          {
            value: '买手-资料修改',
            label: '买手-资料修改',
          },
          {
            value: '买手-资料通过',
            label: '买手-资料通过',
          },
          {
            value: '买手-资料拒绝',
            label: '买手-资料拒绝',
          }
        ],
        auditval:'',
        auditlist: [
          {
            value: '买手-师傅佣金修改',
            label: '买手-师傅佣金修改',
          },
          {
            value: '买手-佣金修改',
            label: '买手-佣金修改',
          },
        ],
        iptval: '',
        timeval: [],
      }
    },
    mounted() {
      let params = {
        page: this.page,
        pageSize: 20,
        type: this.activval,
        begintime: this.timeval[0],
        endtime: this.timeval[1],
        operation_name: this.auditval,
      }
      this.getUserList(params)
    },
    methods: {
      handleCurrentChange(val) {
        this.page = val
        this.onSearch()
      },
      // 获取列表数据
      getUserList(params) {
        SelectLog(params)
          .then((res) => {
            console.log('任务信息', res)
            this.tableData = res.data
            this.total = res.count
          })
          .catch(() => {
            this.tableData = []
            this.total = 0
          })
      },
      //查询
      onSearch() {
        console.log(this.timeval);
        if (this.timeval.length > 0) {
          let list = [...this.timeval]
          let index = list[1].indexOf(" ");
          list[1] = list[1].substring(0, list[1].length - index + 1) + ' 23:59:59'
          this.timeval[1] = list[1]
        }
        let params = {
          page: this.page,
          pageSize: 20,
          type: this.activval,
          begintime: this.timeval[0],
          endtime: this.timeval[1],
          operation_name: this.auditval,
        }
        this.auditval == '商户名' ? params.cooperation = this.iptval
          : this.auditval == '店铺名' ? params.shopname = this.iptval
          : this.auditval == '宝贝ID' ? params.link = this.iptval : ''
        this.getUserList(params)
      },
    }
  }
</script>

<style lang="scss">
  .taskmonitor {
    .el-row {
      margin-bottom: 20px;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  .demo-table-expand {
    font-size: 0;
  }

  .demo-table-expand label {
    width: 90px;
    color: #99a9bf;
  }

  .demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 50%;
  }
</style>
